﻿<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
	<link href="css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
	<link href="css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">
	<link href="css/animate.min.css" rel="stylesheet">
	<link rel="stylesheet" href="css/labelauty.css" />
	<link href="css/style.min862f.css?v=4.1.0" rel="stylesheet">
<title>人工组卷</title>
<style>
		#examlist {
			border: 1px solid #ddd;
			padding: 5px;
			height: 320px;
			height: auto !important;
		}
		
		#examlist .panel-body {
			height: auto !important;
			height: 43px; /*假定最低高度是47px*/
			min-height: 43px;
			padding: 2px;
		}
		.pagination{
			margin: 0;
		}
		.selectCondition{
		   	/* display: block; */
		    height: 34px;
		    font-size: 14px;
		    line-height: 1.42857; 
		   	color: rgb(85, 85, 85);
		    background-color: rgb(255, 255, 255);
		    background-image: none;
		    box-shadow: rgba(0, 0, 0, 0.075) 0px 1px 1px inset;
		    padding: 6px 12px;
		    border-width: 1px;
		    border-style: solid;
		    border-color: rgb(204, 204, 204);
		    border-image: initial;
		    border-radius: 4px;
		    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
		}
	#examlist ul {
		padding: 0;
		margin: 0;
		list-style-type: none;
	}
	
	#examlist li {
		padding: 10px;
		margin-bottom: 10px;
		border: 1px solid #ccc;
		font: 14px/1.5 "微软雅黑";
		list-style: none;
	}
	#examlist li:hover {
	background-color: #f6f6f6;
}
</style>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
	<div class="row">
		<div class="col-md-12">
			<div class="col-md-6">
				<span class="text-center" id="title"><h3>第一站问答试卷</h3> </span>
				<hr />
				<form class="form-horizontal">
					<input type="hidden" name="checkStatusForPaper" value="二审通过">
					<div class="form-group">
						<label class="control-label col-sm-2">站类型</label>
						<div class="col-sm-3">
							<select name="pattern" id="pattern" class="selectCondition"   value="0">
								<option>问答题</option>
								<option>常规化</option>
								<option>客观化</option>
							</select>
						</div>
						<label class="control-label col-sm-2">试卷类型</label>
						<div class="col-sm-2">
							<select id="papertype" class="form-control">
								<option value="0">A</option>
								<option value="1">B</option>
							</select>
						</div>
						<label id="count" class="control-label col-sm-3"></label>
					</div>
					<div class='panel panel-default'>
						<div class='panel-heading'>
						  <input type="radio" name="examtype"  id="examtype1" class="rdolist" checked="checked" />
					        <label class="rdobox">
					            <span class="check-image"></span>
					            <span class="radiobox-content"  id="exam1title">第一题:穴位定位</span>
					        </label>
					        <lable style="font-size:14px;" class='badge pull-right text-primary' id='exam1count'></lable>
						</div>
							<div class='panel-body'>
								<ul id="exam1"></ul>
							</div>
						</div>
					<div class='panel panel-default'>
						<div class='panel-heading'>
						<input type="radio" name="examtype" id="examtype2" class="rdolist"/>
					        <label class="rdobox">
					            <span class="check-image"></span>
					            <span class="radiobox-content" id="exam2title">第二题:问答题</span>
					        </label>
					        <lable style="font-size:14px;" class='badge pull-right text-primary' id='exam2count'></lable>
						</div>
							<div class='panel-body'>
								<ul id="exam2"></ul>
							</div>
						</div>
					<div class='panel panel-default'>
						<div class='panel-heading' >
						<input type="radio" name="examtype" id="examtype3" class="rdolist"/>
					        <label class="rdobox">
					            <span class="check-image"></span>
					            <span class="radiobox-content" id="exam3title">第三题:问答题</span>
					        </label>
					        <lable style="font-size:14px;" class='badge pull-right text-primary' id='exam3count'></lable>
						</div>
							<div class='panel-body'>
								<ul id="exam3"></ul>
							</div>
					</div>

					<br/>
					<div class="form-group text-center">
						<button type="button" id="savepaper" class="btn btn-primary"><i class="glyphicon glyphicon-plus"></i>&nbsp;添加</button>
						<button type="button" id="resetPaper" class="btn btn-default">重置</button>
					</div>
					</form>
				</div>
				<div class="col-md-6">
					<div class="text-center">
						<span><h3>从题库中筛选试题加入到当前试卷</h3> </span>
					</div>
					<hr />
					<div class="form-group">&nbsp;&nbsp;&nbsp;
						<span class="  inline" style="border: 0;"> 
							<select name="first" id="first" onmouseout="selectChange()" class="selectCondition" ></select>
							<select name="second" id="second" onmouseout="selectChange()" class="selectCondition" ></select>
							<select name="third" id="third" class="selectCondition" ></select>
						 </span> 
						 <input type="text" name="keywords"  placeholder=" 请输入关键字......" style="width: 150px" class="selectCondition">
						<a class="btn btn-success" onclick="getData('1')">
							<i class="glyphicon glyphicon-search"></i> 筛选试题
						</a>
					</div>
				<div pattern="1" class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
				</div>
					<div class="text-center">
						<div id="example"></div>
					</div>
			</div>
		</div>
	</div>
</div>
<script src="js/jquery.min.js?v=2.1.4"></script>
<script src="js/bootstrap.min.js?v=3.3.6"></script>
<script src="js/plugins/layer/layer.js"></script>
<script src="js/bootstrap-paginator.js"></script>
<script src="js/labelauty.js"></script>
<script src="js/jquery.dragsort-0.5.2.js"></script>
<script type="text/javascript">
var page = 1;
$("ul").dragsort({
    dragSelector: "li",
    dragEnd: function() { },
    dragBetween: false,
    placeHolderTemplate: "<li></li>"
});
$(function(){
	$(".rdolist").labelauty("rdolist", "rdo");
	getData(page);
	getCount();
	$("#papertype").change(function(){
	getCount();
	});
	$("#pattern").change(function(){
		selectChange();
		select(this);
	})	
});
function getData(page){
	 var pattern= $('#pattern option:selected').val();
	 var first= $('#first option:selected').val();
	 var second=$('#second option:selected').val();
	 var third=$('#third option:selected').val();
	 var keywords=$('input[name="keywords"]').val();
	 var checkStatusForPaper=$('input[name="checkStatusForPaper"]').val();
	$.ajax({
		url:"<%=basePath%>/paper/examList",
		data:{currPage:page,pattern:pattern,first:first,second:second,third:third,keywords:keywords,checkStatusForPaper:checkStatusForPaper},
		type:"POST",
		dataType:"json",
		success:function(data){
		var html = template('examList',data);
    		$("#accordion").html(html);	
	        var totalPages = data.totalPages;
	        var options = {
	            currentPage: page,
	            totalPages: totalPages,
	        	numberOfPages:5,
	  			onPageClicked: function (event, originalEvent, type, page) {
	        		getData(page);
		         }
		    };
		    $("#example").bootstrapPaginator(options);
		}
     });
}

	//获取试卷数量
	function getCount(){
		var pattern = $("#pattern").val();
		var category = $("#papertype").val();
		if(pattern == "第一站问答"){
			pattern = 1;
		}else if (pattern == "第二站常规化"){
			pattern = 2;
		}else if(pattern == "第二站客观化"){
			pattern = 3;
		}
		$.ajax({
		url:"<%=basePath%>/paper/person/total",
		type:"get",
		data:{"pattern":pattern,"category":category},
		dataType:"JSON",
		success:function(data){
			$("#count").html("数量&nbsp;&nbsp;&nbsp;&nbsp;"+data.total+"套");
			if(data.total>=20){
				layer.msg('每站最多添加20套试卷!', { icon: 3, time: 3000 });
				$("#savepaper").attr("disabled","disabled");
			}else{
				$("#savepaper").removeAttr("disabled");
			}
			},error:function(data){
				console.log(data);
			}
		});
	}
	
function select(data) { 
	getCount();
	if ($(data).val() == "第一站问答") {
		$("#title").html("<h3>第一站问答试卷</h3>");
		$("#accordion").attr("pattern","1");
		$("#exam1title").text("第一题:穴位定位");
		$("#exam2title").text("第二题:问答题");
		$("#exam3title").text("第三题:问答题");
		clear_exam();
	}
	if ($(data).val() == "第二站常规化") {
		$("#title").html("<h3>第二站常规化试卷</h3>");
		$("#accordion").attr("pattern","2");
		$("#exam1title").text("第一题:穴位定位");
		$("#exam2title").text("第二题:单项手法");
		$("#exam3title").text("第三题:整套手法");
		clear_exam();
	}
	if ($(data).val() == "第二站客观化") {
		$("#title").html("<h3>第二站客观化试卷</h3>");
		$("#accordion").attr("pattern","3");
		$("#exam1title").text("第一题:穴位定位");
		$("#exam2title").text("第二题:单项手法");
		$("#exam3title").text("第三题:整套手法");
		clear_exam();
	}
	getData(page);
}

function addPaperExam(obj,id,stem,category){
	var exam1Num = $("#exam1 li").size();
	var exam2Num = $("#exam2 li").size();
	var exam3Num = $("#exam3 li").size();
	var pattern = $("#accordion").attr("pattern");
	var check1 = $("#examtype1").is(':checked');
	var check2 = $("#examtype2").is(':checked');
	var check3 = $("#examtype3").is(':checked');
	if(pattern == "1"){
		if(exam1Num ==0&&check1){
			$("#exam1count").text("数量:"+(exam1Num+1));
			$("#exam1").append("<li class='bg-success' examId="+id+" category="+category+" >"+stem+"<a href='#' onclick='remove(this)' class='pull-right'><i class='glyphicon glyphicon-remove'></i></a></li>");
			$(obj).closest(".panel").remove();
			return;
		}
		if(exam2Num == 0&&check2){
			$("#exam2count").text("数量:"+(exam2Num+1));
			$("#exam2").append("<li class='bg-success' examId="+id+" category="+category+" >"+stem+"<a href='#' onclick='remove(this)' class='pull-right'><i class='glyphicon glyphicon-remove'></i></a></li>");
			$(obj).closest(".panel").remove();
			return;
		}
		 if(exam3Num == 0&&check3){
			$("#exam3").append("<li class='bg-success' examId="+id+" category="+category+" >"+stem+"<a href='#' onclick='remove(this)' class='pull-right'><i class='glyphicon glyphicon-remove'></i></a></li>");
			$(obj).closest(".panel").remove();
			return;
		}
	}
	if(pattern == "2"){
		if(exam1Num < 5&&check1){
			$("#exam1count").text("数量:"+(exam1Num+1));
			$("#exam1").append("<li class='bg-success col-md-4' examId="+id+" category="+category+" >"+stem+"<a href='#' onclick='remove(this)' class='pull-right'><i class='glyphicon glyphicon-remove'></i></a></li>");
			$(obj).closest(".panel").remove();
			return;
		}
		if(exam2Num < 4&&check2){
			$("#exam2count").text("数量:"+(exam2Num+1));
			$("#exam2").append("<li class='bg-success' examId="+id+" category="+category+" >"+stem+"<a href='#' onclick='remove(this)' class='pull-right'><i class='glyphicon glyphicon-remove'></i></a></li>");
			$(obj).closest(".panel").remove();
			return;
		}
		 if(exam3Num == 0&&check3){
			$("#exam3").append("<li class='bg-success' examId="+id+" category="+category+" >"+stem+"<a href='#' onclick='remove(this)' class='pull-right'><i class='glyphicon glyphicon-remove'></i></a></li>");
			$(obj).closest(".panel").remove();
			return;
		}
	}
	
	if(pattern == "3"){
		if(exam1Num < 10&&check1){
			$("#exam1count").text("数量:"+(exam1Num+1));
			$("#exam1").append("<li class='bg-success col-md-3' examId="+id+" category="+category+" >"+stem+"<a href='#' onclick='remove(this)' class='pull-right'><i class='glyphicon glyphicon-remove'></i></a></li>");
			$(obj).closest(".panel").remove();
			return;
		}
		if(exam2Num < 4&&check2){
			$("#exam2count").text("数量:"+(exam2Num+1));
			$("#exam2").append("<li class='bg-success col-md-6' examId="+id+" category="+category+" >"+stem+"<a href='#' onclick='remove(this)' class='pull-right'><i class='glyphicon glyphicon-remove'></i></a></li>");
			$(obj).closest(".panel").remove();
			return;
		}
		 if(exam3Num == 0&&check3){
			$("#exam3").append("<li class='bg-success' examId="+id+" category="+category+" >"+stem+"<a href='#' onclick='remove(this)' class='pull-right'><i class='glyphicon glyphicon-remove'></i></a></li>");
			$(obj).closest(".panel").remove();
			return;
		}
	}
}

function remove(obj){
	$(obj).parent().remove();
	var exam1Num = $("#exam1 li").size();
	var exam2Num = $("#exam2 li").size();
	$("#exam1count").text("数量:"+(exam1Num));
	$("#exam2count").text("数量:"+(exam2Num));
}

function clear_exam(){
	$("#exam1").empty();
	$("#exam2").empty();
	$("#exam3").empty();
	$("#exam1count").empty();
	$("#exam2count").empty();
	$("#exam3count").empty();
	}

$(document).ready(function() {
	//重置
	$("#resetPaper").click(function(){
		clear_exam();
	});
	
	//添加试卷
	$("#savepaper").click(function() {
		//获站类型
		var pattern = $("#pattern").val();
		//获取试卷类型
		var papertype = $("#papertype").val();
		var exam1 = [];
		var exam2 = [];
		var exam3 = [];
		var exam1Category = [];
		var exam2Category = [];
		var exam3Category = [];


           $("#exam1 li").each(function() {  
               exam1.push($(this).attr("examId"));
               exam1Category.push($(this).attr("category"));
           });
           $("#exam2 li").each(function() {  
               exam2.push($(this).attr("examId"));
               exam2Category.push($(this).attr("category"));
           }); 
           $("#exam3 li").each(function() {  
               exam3.push($(this).attr("examId"));
               exam3Category.push($(this).attr("category"));
           });
           if(exam1 == null||exam1 == ''||exam2 == null||exam2 == ''||exam3 == null||exam3 == ''){
          	 	layer.msg('请选择试题!', { icon: 5, time: 2000 });
          	 	return;
           }
		//判断试题数量是否添加正确
		if(pattern== "第一站问答"){
			if(exam1.length!=1||exam2.length!=1||exam3.length!=1){
				layer.msg('请按照组卷策略试题数量添加!', { icon: 5, time: 2000 });
				return;
			}
		}else if(pattern== "第二站常规化"){
			if(exam1.length!=5||exam2.length!=4||exam3.length!=1){
				layer.msg('请按照组卷策略试题数量添加!', { icon: 5, time: 2000 });
				return;
			}
		}else if(pattern== "第二站客观化"){
			if(exam1.length!=10||exam2.length!=4||exam3.length!=1){
				layer.msg('请按照组卷策略试题数量添加!', { icon: 5, time: 2000 });
				return;
			}
		}
		 var data = {
			"pattern" : pattern,
			"paperType" : papertype,
			"exam1":exam1,
			"exam2":exam2,
			"exam3":exam3,
			"exam1Category":exam1Category,
			"exam2Category":exam2Category,
			"exam3Category":exam3Category
			};					
		$.ajax({
	        url: "<%=basePath%>/paper/person/add",
	        type: "POST",
	        data: data, 
	        cache : false,  
            traditional :true, 
	        success: function(data){
	            var result = data.status;
		        if(result == "4001"){
			        layer.msg('您没有权限!',{icon:4,time:1000});
		        }else if(undefined == result){
	                layer.msg('添加失败!', { icon: 2, time: 2000 });
	            }else if(result == "1001" || result == "2001"){
	            	layer.msg('第一题未按照组卷策略添加!', { icon: 5, time: 2000 });
	            }else if(result == "1002" || result == "2002"){
	            	layer.msg('第二题未按照组卷策略添加!', { icon: 5, time: 2000 });
	            }else if(result == "1003"){
	            	layer.msg('第三题未按照组卷策略添加!', { icon: 5, time: 1000 });
	            }else if(result == "1000"){
	            	layer.msg('添加成功!', { icon: 1, time: 1000 });
					setTimeout(function () {
						window.location.reload();
					}, 500);
	            }else if(result == "3001"){
	            	layer.msg('第一题请按照从前到后、从上到下的顺序选择穴位!', { icon: 5, time: 2000 });
	            }else if(result == "3002"){
	            	layer.msg('第一题请避免同一经络!', { icon: 5, time: 2000 });
	            }else if(result == "3003"){
	            	layer.msg('第二题请避免同一部位!', { icon: 5, time: 2000 });
	            }else if(result == "3004"){
	            	layer.msg('试题添加有误!', { icon: 5, time: 2000 });
	            }
	        }
	    });
	});
});
//试题分类初始化
categoryInit('pattern', 'first', 'second', 'third', '一', '二', '三', '四');
</script>
<script type="text/html" id="examList">
{{each examlist as value i}}
<div class="panel panel-default">
	<div class="panel-heading" role="tab" id="headingTwo">
		<h4 class="panel-title">
        <li style="list-style-type:none;" class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapse{{i}}" aria-expanded="false" aria-controls="collapseTwo">
			{{value.stem}}
			<a class="pull-right addExam" onclick="addPaperExam(this,'{{value.id}}','{{value.stem}}',{{value.category}})" href="#"><i class="glyphicon glyphicon-plus"></i></a>
        </li>
      </h4>
	</div>
	<div id="collapse{{i}}" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
		<div class="panel-body">
			<iframe  style="min-height:280px;width:100%"  frameborder="0" src="<%=basePath%>/paper/examinationDetails/{{value.id}}/{{value.category}}" ></iframe> 
		</div>
	</div>
</div>
{{/each}}
</script>
</body>
</html>